@font-face {
	font-family: 'DSDigital';
	src: url('../../../font/DSDigital.ttf') format('truetype');
	src: url('../../../font/DSDigital.ttf') format('truetype'),
         url('../../../font/DSDigital.eot?#iefix') format('embedded-opentype'),
	     url('../../../font/DSDigital.woff') format('woff'),
		 url('../../../font/DSDigital.svg#DSDigital') format('svg'),
		 url('../../../font/DSDigital.otf') format('truetype');
	font-weight: normal;
	font-style: normal;
}
.banner {margin-bottom:5em;padding:4em 0 2em;background:url(../images/bg.jpg);font-family:Microsoft Yahei;color:#000;}
.banner-inner{position:relative;padding:2em 0;background:url(../images/bg-time.png) no-repeat;}
.front {margin-top:-127px;}
.banner-inner .upper, .banner-inner .lower {height:64px;}
.banner-inner span {display:inline-block;position:relative;width:255px;height:64px;}
.banner-inner img {position:absolute;width:125px;height:64px;}
.banner-inner i {display:inline-block;width:10px;height:10px;background-color:#fff;border-radius:10px;font-size:0;}
.upper i {margin:-10px 10px 0;vertical-align:text-top;}
.lower i {margin:10px 10px 0;vertical-align:top;}
.front i {background:none;}
.banner-inner .upper img {bottom:0;}
.banner-inner .lower img {top:0;}
.tens {left:0;}
.units {right:0;}
.banner-inner em {position:absolute;bottom:-1.5em;left:45%;font-style:normal;color:#fff;}
.banner p {margin-top:.5em;font-size:2em;font-weight:700;color:#fff;}
.list {font:14px Arial, Helvetica, sans-serif;}
.list li {display:inline-block;min-width:133px;max-width:220px;width:20%;margin:0 4.5% 3% 0;text-align:center;vertical-align:top;transition: background 0.5s ease-in,color 0.3s ease-out;*display:inline;*zoom:1;}
.list .img-area {display:block;position:relative;}
.list a {display:block;position:relative;}
.list img, .list strong, .list del, .list p {display:block;margin-bottom:5px;}
.list img {display:block;}
.list strong {overflow:hidden;height:32px;}
.mask-box {position:absolute;top:0;left:0;width:100%;height:100%;background-color:rgba(0,0,0,.5);color:#fff;}
.mask-box p {position:absolute;top:0;right:0;bottom:0;left:0;margin:auto;width:80%;height:31%;line-height:1.5;color:#000;color:#fff;}
.mask-box .btn {margin-top:1em;}
.btn {min-width:inherit;width:100%;height:auto;padding:5px;background-color:#777;line-height:1;font-family:Arial, Helvetica, sans-serif;*min-width:auto;}
.list .btn:hover {background-color:#777;}
.list .btn.active {background-color:#036;}
.list .countdown {position:absolute;bottom:0;left:0;width:100%;padding:.22em 0;background-color:#4a4c4d;font:2em/1 DSDigital, Microsoft Yahei;color:#fff;}
.heading {background-color:#777;font-size:2.14em;}
.heading strong {top:-23px;padding:0 2%;}
.rule {margin-bottom:3em;background-color:#f9f9f9;font-size:1.14em;line-height:2.5;font-style:italic;}
.rule li {float:left;width:45.9%;padding:2%;text-align:center;}
.rule .rule-item {padding-bottom:6em;border-right:1px dashed #8a8a8a;}
.rule .item-ok {background:url(../images/signet.png) no-repeat center 4.5em;}
.rule i {line-height:1;font-size:2.57em;font-style:normal;}
.rule p {margin-bottom:.5em;color:#000;}
.rule strong {display:block;}
.rule .btn {width:auto;padding:.3em .8em;background-color:#036;font-style:normal;}
.rule .btn1 {background-color:#777;}
.graphic {display:inline-block;padding:.2em .5em;box-shadow:3px 5px 5px #555;*width:35%;*padding:.5em;border:1px solid #555\0;*border:1px solid #555;}
.graphic span {vertical-align:middle;}
.graphic .btn {cursor:text;}
.graphic .arrow {display:inline-block;width:48px;height:14px;margin:0 1em;background:url(../images/arrow-right.png) no-repeat;}
.goods > p {margin:1em 0 1.5em;}
.goods li {display:inline-block;min-width:133px;max-width:220px;margin: 0 1em 2em 0;vertical-align:top;*display:inline;*zoom:1;}

@media screen and (max-width: 741px) {
  body {font-size:14px;}
  .banner li {width:7em;height:7em;}
}
@media screen and (max-width: 320px) {
  body {font-size:12px;}
  .banner li {width:20%;margin:0 auto;}
  .banner .divider {display:none;}
  .banner em {font-size:5em;}
  .banner p {font-size:1.5em;}
  .rule li {float:none;width:auto;border:none !important;border-bottom:1px dashed #8a8a8a !important;}
  .rule .btn1 {margin: 0 0 5em;}
  .graphic {padding:.3em .5em;}
  .graphic .btn {display:block;}
  .graphic .arrow {width:14px;height:48px;margin:1em 0;background:url(../images/arrow-down.png) no-repeat;}
}